/**
 * @Description:登录主入口
 * @author 云离
 * @date: 2018/12/28
 */
import React, { Component } from 'react'
import {actions} from "../../../../reducers/main"
import { connect } from 'react-redux'
import {withRouter} from "react-router-dom"
import {message, Spin, Table, Switch, Button, Icon, Pagination, Modal, Tag} from 'antd'
import MyForm from '../../../components/Form'
import axios from '../../../../apis/api'
import qs from 'qs'
const {confirm} = Modal


const mapStateToProps = (state, ownProps) => {
    return {
        vwAgentCashStat: state.main.vwAgentCashStat,
        vwAgentCashDayStat: state.main.vwAgentCashDayStat
    }
}

const mapDispatchToProps = (dispatch) => {
    return {
        fetchInitData: (next) => dispatch(actions.fetchInitData(next))
    }
}

const formItems = [{
    label: '码商代理',
    key: 'userId',
    type: 'input'
},{
    label: '统计开始时间',
    key: 'params[beginTime]',
    type: 'DatePicker',
}, {
    label: '统计结束时间',
    key: 'params[endTime]',
    type: 'DatePicker',
}]

class ChannelBusinessDayChart extends Component {
    state = {
        initForm: {
            userId: '',
            'params[beginTime]': null,
            'params[endTime]': null
        },
        formItmes: formItems,
        searchParam: {},
        loading: false,
        depMap: {},
        pageSize: 10,
        curPage: 1,
        tableData: {
            total: 0,
            rows: []
        },
        payTypes: [], // 支付类型
        payTypesMap:{},
    }

    handleSearch = (value) => {
        this.setState({
            curPage: 1,
            searchParam: value
        }, this.searchTable)
    }

    componentDidMount() {
        this.init()
    }
    init = async () => {
        this.searchTable()
    }

    searchTable = async () => {
        const {pageSize, curPage, searchParam} = this.state
        const query = {
            orderByColumn: 'createTime',
            isAsc: 'desc',
            pageSize,
            pageNum: curPage,
            userId: searchParam.userId,
            'params[beginTime]': (searchParam.params && searchParam.params.beginTime && searchParam.params.beginTime.format('YYYY-MM-DD')) || '',
            'params[endTime]': (searchParam.params && searchParam.params.endTime && searchParam.params.endTime.format('YYYY-MM-DD')) || '',
        }
        try {
            this.setState({
                loading: true
            })
            const result = await axios.post('/channel/vwChannelCashDayStat/list', qs.stringify(query))
            if (result.code === 0) {
                this.setState({
                    tableData: result,
                    loading: false
                })
            } else {
                this.setState({
                    loading: false
                })
                message.error(result.msg)
            }
        } catch (e) {
            this.setState({
                loading: false
            })
            message.error(e.message)
        }
    }
    //翻页
    handlePageChange = (page, pageSize) => {
        this.setState({
            curPage: page
        },this.searchTable)
    }

    onShowSizeChange = (current, pageSize) => {
        this.setState({
            pageSize: pageSize,
            curPage: current,
        }, this.searchTable)
    }

    render() {
        const {initForm, formItmes, loading, tableData, curPage, pageSize, payTypesMap} = this.state
        const columns = [{
            title: '码商代理',
            dataIndex: 'channelUserName',
            key: 'channelUserName'
        },{
            title: '统计时间',
            dataIndex: 'createTime',
            key: 'createTime'
        },{
            title: '收款总额',
            dataIndex: 'sjjeSum',
            key: 'sjjeSum'
        },{
            title: '码商代理手续费',
            dataIndex: 'channelFeeSum',
            key: 'channelFeeSum'
        },{
            title: '商户手续费',
            dataIndex: 'businessFeeSum',
            key: 'businessFeeSum'
        },{
            title: '支付商手续费',
            dataIndex: 'payerFeeSum',
            key: 'payerFeeSum'
        },{
            title: '收款成功次数',
            dataIndex: 'receiveSuccessSum',
            key: 'receiveSuccessSum'
        },{
            title: '收款次数',
            dataIndex: 'receiveSum',
            key: 'receiveSum'
        },{
            title: '成功率',
            dataIndex: 'sucessRate',
            key: 'sucessRate'
        }]
        return (
            <div>
                <MyForm initForm={initForm} items={formItmes} handleSearch={this.handleSearch}/>
                <Spin spinning={loading}>
                    <Table dataSource={tableData.rows} columns={columns} pagination={false}  scroll={{x: true}}/>
                    <Pagination
                        style={{marginTop: 10, marginBottom: 20}}
                        total={tableData.total}
                        showTotal={total => `共 ${total} 项`}
                        pageSizeOptions={['10', '20', '50', '100', '500']}
                        showSizeChanger
                        onShowSizeChange={this.onShowSizeChange}
                        pageSize={pageSize}
                        current={curPage}
                        onChange={this.handlePageChange}
                    />
                </Spin>
            </div>
        )
    }
}

export default connect(mapStateToProps, mapDispatchToProps)(withRouter(ChannelBusinessDayChart))
